<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core"
	xmlns:a4j="http://richfaces.org/a4j"
	xmlns:rich="http://richfaces.org/rich">

<ui:composition template="../template.xhtml">
	<ui:define name="content">
		<h:outputStylesheet library="css" name="richfaces.css" />
		<h1>Subscribers</h1>
		<h:form>
			<div>
				<h:commandLink value="New" action="#{subscriberBean.editSubscriber}">
					<f:setPropertyActionListener
							target="#{subscriberEditorBean.subscriber}" value="#{null}" />
				</h:commandLink>
			</div>
			<rich:dataTable value="#{subscriberBean.subscribers}" var="subscriber"
				iterationStatusVar="it" id="tableSubscriber"
				rowClasses="odd-row, even-row" styleClass="stable"
				rows="#{subscriberBean.recordsPerPage}">

				<!-- Hlavicky tabulky -->
				<f:facet name="header">
					<rich:columnGroup>
						<rich:column colspan="3">
						</rich:column>
						<rich:column colspan="3">
							<h:outputText value="Bank account" />
						</rich:column>
						<rich:column />
					</rich:columnGroup>
				</f:facet>

				<!-- Telo tabulky -->
				<rich:column sortBy="#{subscriber.name}" id="name"
					sortOrder="#{subscriberSortingBean.nameOrder}">
					<f:facet name="header">
						<a4j:commandLink value="Name" render="tableSubscriber"
							action="#{subscriberSortingBean.sortByName}" />
					</f:facet>
					<h:outputText value="#{subscriber.name}" />
				</rich:column>
				<rich:column sortBy="#{subscriber.ico}" id="ico"
					sortOrder="#{subscriberSortingBean.icoOrder}">
					<f:facet name="header">
						<a4j:commandLink value="IČO" render="tableSubscriber"
							action="#{subscriberSortingBean.sortByIco}" />
					</f:facet>
					<h:outputText value="#{subscriber.ico}" />
				</rich:column>
				<rich:column sortBy="#{subscriber.dic}" id="dic"
					sortOrder="#{subscriberSortingBean.dicOrder}">
					<f:facet name="header">
						<a4j:commandLink value="DIČ" render="tableSubscriber"
							action="#{subscriberSortingBean.sortByDic}" />
					</f:facet>
					<h:outputText value="#{subscriber.dic}" />
				</rich:column>
				<rich:column sortBy="#{subscriber.bankAccount.accountNumber}"
					id="accountNumber"
					sortOrder="#{subscriberSortingBean.accountNumberOrder}">
					<f:facet name="header">
						<a4j:commandLink value="Account number" render="tableSubscriber"
							action="#{subscriberSortingBean.sortByAccountNumber}" />
					</f:facet>
					<h:outputText value="#{subscriber.bankAccount.accountNumber}" />
				</rich:column>
				<rich:column sortBy="#{subscriber.bankAccount.bankName}" id="bankName"
					sortOrder="#{subscriberSortingBean.bankNameOrder}">
					<f:facet name="header">
						<a4j:commandLink value="Bank name" render="tableSubscriber"
							action="#{subscriberSortingBean.sortByBankName}" />
					</f:facet>
					<h:outputText value="#{subscriber.bankAccount.bankName}" />
				</rich:column>
				<rich:column sortBy="#{subscriber.bankAccount.iban}" id="iban"
					sortOrder="#{subscriberSortingBean.ibanOrder}">
					<f:facet name="header">
						<a4j:commandLink value="IBAN" render="tableSubscriber"
							action="#{subscriberSortingBean.sortByIban}" />
					</f:facet>
					<h:outputText value="#{subscriber.bankAccount.iban}" />
				</rich:column>
				<rich:column>
					<!-- Linka na Vymazanie zaznamu -->
					<h:commandLink value="Edit" action="#{subscriberBean.editSubscriber}">
					<f:setPropertyActionListener
							target="#{subscriberEditorBean.subscriber}" value="#{subscriber}" />
					</h:commandLink>
					<!-- Linka na Vymazanie zaznamu -->
					<a4j:commandLink execute="@this" render="confirmPane"
						oncomplete="#{rich:component('confirmPane')}.show()"
						value="Delete">
						<f:setPropertyActionListener
							target="#{subscriberConfirmDeleteDialogBean.subscriber}" value="#{subscriber}" />
					</a4j:commandLink>
				</rich:column>
				<f:facet name="footer">
					<rich:dataScroller page="#{subscriberBean.page}" />
				</f:facet>
			</rich:dataTable>

			<!-- JQuery na stylizaciu tabulky -->
			<rich:jQuery selector=".stable tr:odd" query="addClass('odd-row')" />
			<rich:jQuery selector=".stable tr:even" query="addClass('even-row')" />
			<rich:jQuery selector=".stable tr" event="mouseover"
				query="jQuery(this).addClass('active-row')" />
			<rich:jQuery selector=".stable tr" event="mouseout"
				query="jQuery(this).removeClass('active-row')" />
			
			<!-- Potvrdzovaci dialog vymazania dodavatela -->
			<rich:popupPanel id="confirmPane" header="#{subscriberConfirmDeleteDialogBean.title}"
				autosized="true">
        	<h:outputText value="#{subscriberConfirmDeleteDialogBean.question}" /><br />
				<a4j:commandButton value="Yes"
					action="#{subscriberConfirmDeleteDialogBean.submit}" render="tableSubscriber"
					execute="confirmPane"
					oncomplete="#{rich:component('confirmPane')}.hide();" />
				<a4j:commandButton value="No"
					onclick="#{rich:component('confirmPane')}.hide(); return false;" />
			</rich:popupPanel>
		</h:form>
	</ui:define>
</ui:composition>
</html>